<!DOCTYPE html>
<html lang="en" xml:lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta content="text/html; charset=utf-8" http-equiv="content-type"/>
<meta content="en-us" http-equiv="Content-Language"/>
<title>Font name - FontFriend Typekit Demo (Web Font Specimen)</title>
<link rel="stylesheet" type="text/css" media="screen" href="css/reset.css" />
<link rel="stylesheet" type="text/css" media="screen" href="css/960.css" />
<link rel="stylesheet" type="text/css" media="screen" href="css/wfs.css" />

<script src="http://use.typekit.net/vsg7cjt.js"></script>
<script>try{Typekit.load();}catch(e){}</script>
<script> var _gaq=_gaq||[];_gaq.push(["_setAccount","UA-518812-8"]);_gaq.push(["_trackPageview"]);(function(A){var C=A.createElement("script");C.async=true;C.src=("https:"==A.location.protocol?"https://ssl":"http://www")+".google-analytics.com/ga.js";var B=A.getElementsByTagName("script")[0];B.parentNode.insertBefore(C,B);})(document); </script>
</head>


<body id="soma-web-font-specimen">
<div id="header" class="container_16 clearfix">


<!-- NAME OF TYPEFACE -->
<div class="grid_16">
	<h1>Font name</h1>
</div>

<p class="grid_16" id="soma-intro">This page demonstrates <a href="http://somadesign.ca/projects/fontfriend/">FontFriend</a>’s <a href="http://typekit.com/">Typekit</a> integration. All fonts in your kit will automatically show up in the Custom Font Family list.<br /><em>This page has FontFriend embedded, but you would normally invoke it with the bookmarklet. (See the <a href="http://somadesign.ca/projects/fontfriend/">FontFriend project page</a> for instructions.)</em></p>

<!-- TEXT SAMPLE -->
<div class="grid_8">
	<h2>Text sample <span>&#8211; CSS font-size (px) with 1.4em line-height</span></h2>
	<p class="s s18"><span>18</span> Is not the best kind of originality that which comes after a sound apprenticeship? That which shall prove to be the blending of a firm conception of, &#8220;useful precedent&#8221;&hellip;</p>
	<p class="s s16"><span>16</span> Is not the best kind of originality that which comes after a sound apprenticeship? That which shall prove to be the blending of a firm conception of, &#8220;useful precedent&#8221; and the progressive&hellip;</p>
	<p class="s s14"><span>14</span> Is not the best kind of originality that which comes after a sound apprenticeship? That which shall prove to be the blending of a firm conception of, &#8220;useful precedent&#8221; and the progressive tendencies of&hellip;</p>
	<p class="s s13"><span>13</span> Is not the best kind of originality that which comes after a sound apprenticeship? That which shall prove to be the blending of a firm conception of, &#8220;useful precedent&#8221; and the progressive tendencies of an able mind. For, let&hellip;</p>
	<p class="s s12"><span>12</span> Is not the best kind of originality that which comes after a sound apprenticeship? That which shall prove to be the blending of a firm conception of, &#8220;useful precedent&#8221; and the progressive tendencies of an able mind. For, let a man be as able &amp; original&hellip;</p>
	<p class="s s11"><span>11</span> Is not the best kind of originality that which comes after a sound apprenticeship? That which shall prove to be the blending of a firm conception of, &#8220;useful precedent&#8221; and the progressive tendencies of an able mind. For, let a man be as able &amp; original as he may&hellip;</p>
	<p class="s s10"><span>10</span> Is not the best kind of originality that which comes after a sound apprenticeship? That which shall prove to be the blending of a firm conception of, &#8220;useful precedent&#8221; and the progressive tendencies of an able mind. For, let a man be as able &amp; original as he may, he can&#8217;t afford to discard knowledge of what&hellip;</p>
	<p class="s s9"><span>9</span> Is not the best kind of originality that which comes after a sound apprenticeship? That which shall prove to be the blending of a firm conception of, &#8220;useful precedent&#8221; and the progressive tendencies of an able mind. For, let a man be as able &amp; original as he may, he can&#8217;t afford to discard knowledge of what has gone before or what is now going&hellip;</p>
</div>


<!-- CHARACTER SET -->
<div class="grid_8 charset">
	<h2>Characters</h2>
	<p class="s s56">A&#8201;B&#8201;C&#8201;D&#8201;E&#8201;F&#8201;G&#8201;H&#8201;I&#8201;J&#8201;K&#8201;L&#8201;M&#8201;N&#8201;O&#8201;P&#8201;Q&#8201;R&#8201;S&#8201;T&#8201;U&#8201;V&#8201;W&#8201;X&#8201;Y&#8201;Z<br />
	a&#8201;b&#8201;c&#8201;d&#8201;e&#8201;f&#8201;g&#8201;h&#8201;i&#8201;j&#8201;k&#8201;l&#8201;m&#8201;n&#8201;o&#8201;p&#8201;q&#8201;r&#8201;s&#8201;t&#8201;u&#8201;v&#8201;w&#8201;x&#8201;y&#8201;z<br />
	1&#8201;2&#8201;3&#8201;4&#8201;5&#8201;6&#8201;7&#8201;8&#8201;9&#8201;0&#8201;&amp;&#8201;@&#8201;.&#8201;,&#8201;?&#8201;!&#8201;&#8217;&#8201;&#8220;&#8201;&#8221;&#8201;(&#8201;)</p>
</div>
</div><!-- end .container_16 -->


<!-- BODY SIZE COMPARISON -->
<div class="container_16 clearfix">
<div class="grid_16">
	<h2>Body size comparison</h2>

	<div class="bodysize">
		<table>
		<tr>
			<th>Georgia <a href="http://www.codestyle.org/servlets/FontStack?stack=Georgia,New+Century+Schoolbook,Nimbus+Roman+No9+L&generic=serif">stack</a></th>
			<th class="base">Font name</th>
			<th>Verdana <a href="http://www.codestyle.org/servlets/FontStack?stack=Verdana&generic=sans-serif">stack</a></th>
			<th>Arial <a href="http://www.codestyle.org/servlets/FontStack?stack=Arial,Helvetica&generic=sans-serif">stack</a></th>
		</tr>
		<tr>
			<td class="tf typeface2"><span>Body</span></td>
			<td><span>Body</span></td>
			<td class="tf typeface3"><span>Body</span></td>
			<td class="tf typeface4"><span>Body</span></td>

		</tr>
		<tr class="paras">
			<td class="typeface2">Is not the best kind of originality that which comes after a sound apprenticeship? That which shall prove to be the blending of a firm conception of, “useful precedent” and the progressive tendencies of an able mind. For, let a man be as able &amp; original as he may, he can’t afford to discard…</td>
			<td>Is not the best kind of originality that which comes after a sound apprenticeship? That which shall prove to be the blending of a firm conception of, “useful precedent” and the progressive tendencies of an able mind. For, let a man be as able &amp; original as he may, he can’t afford to discard…</td>
			<td class="typeface3">Is not the best kind of originality that which comes after a sound apprenticeship? That which shall prove to be the blending of a firm conception of, “useful precedent” and the progressive tendencies of an able mind. For, let a man be as able &amp; original as he may, he can’t afford to discard…</td>
			<td class="typeface4">Is not the best kind of originality that which comes after a sound apprenticeship? That which shall prove to be the blending of a firm conception of, “useful precedent” and the progressive tendencies of an able mind. For, let a man be as able &amp; original as he may, he can’t afford to discard…</td>
		</tr>
		</table>
	</div><!-- end .bodysize -->

</div>
</div><!-- end .container-16 -->


<!-- GRAYSCALE -->

<div class="container_16 clearfix">
<div class="grid_16 clearfix">
	<h2>Grayscale <span>&#8211; CSS hex color</span></h2>
</div>

<div class="grayscale clearfix">
<div class="grid_8 white">
	<p class="c000"><span>#000</span>The best kind of originality is that which comes after a sound apprenticeship, that which shall prove to be the blending of a firm conception of useful precedent and the progressive tendencies of an able mind. For, let a man be as able and original as he may, he cannot afford to</p>
	<p class="c333"><span>#333</span>The best kind of originality is that which comes after a sound apprenticeship, that which shall prove to be the blending of a firm conception of useful precedent and the progressive tendencies of an able mind. For, let a man be as able and original as he may, he cannot afford to</p>
	<p class="c666"><span>#666</span>The best kind of originality is that which comes after a sound apprenticeship, that which shall prove to be the blending of a firm conception of useful precedent and the progressive tendencies of an able mind. For, let a man be as able and original as he may, he cannot afford to</p>
	<p class="c999"><span>#999</span>The best kind of originality is that which comes after a sound apprenticeship, that which shall prove to be the blending of a firm conception of useful precedent and the progressive tendencies of an able mind. For, let a man be as able and original as he may, he cannot afford to</p>
	<p class="cCCC"><span>#CCC</span>The best kind of originality is that which comes after a sound apprenticeship, that which shall prove to be the blending of a firm conception of useful precedent and the progressive tendencies of an able mind. For, let a man be as able and original as he may, he cannot afford to</p>
</div>

<div class="grid_8 black">
	<p class="cFFF"><span>#FFF</span>The best kind of originality is that which comes after a sound apprenticeship, that which shall prove to be the blending of a firm conception of useful precedent and the progressive tendencies of an able mind. For, let a man be as able and original as he may, he cannot afford to</p>
	<p class="cCCC"><span>#CCC</span>The best kind of originality is that which comes after a sound apprenticeship, that which shall prove to be the blending of a firm conception of useful precedent and the progressive tendencies of an able mind. For, let a man be as able and original as he may, he cannot afford to</p>
	<p class="c999"><span>#999</span>The best kind of originality is that which comes after a sound apprenticeship, that which shall prove to be the blending of a firm conception of useful precedent and the progressive tendencies of an able mind. For, let a man be as able and original as he may, he cannot afford to</p>
	<p class="c666"><span>#666</span>The best kind of originality is that which comes after a sound apprenticeship, that which shall prove to be the blending of a firm conception of useful precedent and the progressive tendencies of an able mind. For, let a man be as able and original as he may, he cannot afford to</p>
	<p class="c333"><span>#333</span>The best kind of originality is that which comes after a sound apprenticeship, that which shall prove to be the blending of a firm conception of useful precedent and the progressive tendencies of an able mind. For, let a man be as able and original as he may, he cannot afford to</p>
</div>
</div><!-- end .grayscale -->
</div><!-- end .container-16 -->


<!-- SIZE U&LC -->
<div class="container_16 ulc clearfix">
<div class="grid_16">
	<h2>Size <span>&#8211; CSS font-size (px)</span></h2>
	<p class="s s36"><span>36</span> <span class="text">Pack my box with five dozen liquor jugs.</span></p>
	<p class="s s30"><span>30</span> <span class="text">Pack my box with five dozen liquor jugs.</span></p>
	<p class="s s24"><span>24</span> <span class="text">Pack my box with five dozen liquor jugs.</span></p>
</div><div class="clearfix"></div>
<div class="grid_10">
	<p class="s s21"><span>21</span> <span class="text">Pack my box with five dozen liquor jugs.</span></p>
	<p class="s s18"><span>18</span> <span class="text">Pack my box with five dozen liquor jugs.</span></p>
</div>
<div class="grid_6 upp">
	<p class="s s9"><span>9</span> <span class="text">Pack my box with five dozen liquor jugs</span></p>
	<p class="s s10"><span>10</span> <span class="text">Pack my box with five dozen liquor jugs</span></p>
</div><div class="clearfix"></div>
<div class="grid_8">
	<p class="s s16"><span>16</span> <span class="text">Pack my box with five dozen liquor jugs.</span></p>
	<p class="s s14"><span>14</span> <span class="text">Pack my box with five dozen liquor jugs.</span></p>
	<p class="s s13"><span>13</span> <span class="text">Pack my box with five dozen liquor jugs.</span></p>
</div>
<div class="grid_8 upp">
	<p class="s s11"><span>11</span> <span class="text">Pack my box with five dozen liquor jugs</span></p>
	<p class="s s12"><span>12</span> <span class="text">Pack my box with five dozen liquor jugs</span></p>
	<p class="s s13"><span>13</span> <span class="text">Pack my box with five dozen liquor jugs</span></p>
</div><div class="clearfix"></div>
<div class="grid_6">
	<p class="s s12"><span>12</span> <span class="text">Pack my box with five dozen liquor jugs.</span></p>
	<p class="s s11"><span>11</span> <span class="text">Pack my box with five dozen liquor jugs.</span></p>
	<p class="s s10"><span>10</span> <span class="text">Pack my box with five dozen liquor jugs.</span></p>
	<p class="s s9"><span>9</span> <span class="text">Pack my box with five dozen liquor jugs.</span></p>
</div>
<div class="grid_10 upp">
	<p class="s s14"><span>14</span> <span class="text">Pack my box with five dozen liquor jugs</span></p>
	<p class="s s16"><span>16</span> <span class="text">Pack my box with five dozen liquor jugs</span></p>
	<p class="s s18"><span>18</span> <span class="text">Pack my box with five dozen liquor jugs</span></p>
</div><div class="clearfix"></div>
<div class="grid_16 upp">
	<p class="s s21"><span>21</span> <span class="text">Pack my box with five dozen liquor jugs</span></p>
	<p class="s s24"><span>24</span> <span class="text">Pack my box with five dozen liquor jugs</span></p>
	<p class="s s30"><span>30</span> <span class="text">Pack my box with five dozen liquor jugs</span></p>
</div>
</div><!-- end .container_16 -->


<!-- ABOUT -->
<div id="footer" class="container_12">
<div class="grid_6 suffix_6">
	<p>This web font specimen is brought to you by <a href="http://nicewebtype.com/">Nice Web Type</a>.<br />
	<a href="http://webfontspecimen.com/">Grab a copy and test your type</a>. Licensed via <a rel="license" href="http://creativecommons.org/licenses/by/3.0/us/">Creative Commons</a>.</p>
</div>
</div><!-- end #footer -->

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script>window.jQuery || document.write("<script src='js/jquery-1.6.1.min.js'>\x3C/script>")</script>
<script src="font-friend-full.js"></script>
</body>
</html>